<template>
	<div>
		<div class="head2">
			<div>
				<router-link to="/pc/home">
					<h3><i class="el-icon-notebook-2"></i>&nbsp;更改密码</h3>
				</router-link>
			</div>
		</div>
		<div style="height: 10px;"></div>
		<div style="width: 90%; min-height: 30vh; display:flex;   justify-content:center;  align-items:center; ">
			<div style="width: 40vw;">
				<el-form ref="form" :model="form" :rules="formRule" label-width="100px" size="small"
					label-position="left">
					<el-form-item label="旧密码" prop="pwd">
						<el-input v-model="form.oldPwd"></el-input>
					</el-form-item>
					<el-form-item label="新密码" prop="pwd2">
						<el-input v-model="form.newPwd"></el-input>
					</el-form-item>
					<el-form-item label="新密码确认" prop="pwd3">
						<el-input v-model="form.newPwd2"></el-input>
					</el-form-item>
				</el-form>
				<hr>
				<div style="display: flex;justify-content: flex-end;">
					<el-button type="danger" v-on:click="update()">确认修改密码</el-button>
				</div>
			</div>
		</div>

		<p>&nbsp;</p>

	</div>
</template>

<script>
	export default {
		name: 'Updatepwd',
		data() {
			return {
				form: {},
				formRule: {
					pwd: [{
						required: true,
						message: '请输入',
						trigger: 'blur'
					}],
					pwd2: [{
						required: true,
						message: '请输入',
						trigger: 'blur'
					}],
					pwd3: [{
						required: true,
						message: '请输入',
						trigger: 'blur'
					}],
				}
			}
		},
		methods: {
			update() {
				if (this.form.newPwd != this.form.newPwd2) {
					this.$message.error("新密码2次输入不一致 ")
					return;
				}

				console.log(this.form)
				this.$postx("/api/user/updatePwd", this.form).then((resp) => {
					this.$message.error(resp.data.msg)
				})
				this.$router.push('/pc/user');
			} 
		}
	}
</script>

<style scoped>
</style>